import React from 'react'
// const ContextDemo = React.lazy(() => import('./ContextDemo'))

// 模拟动态加载组件
const LazyComponet = _ => "I am a lazy man"
const delay = ms => new Promise(resolve => setTimeout(resolve, ms))
const ContextDemo = React.lazy(() => delay(5000).then(x => ({"default": LazyComponet})))

class LazyDemo extends React.Component {
    // constructor(props) {
    //     super(props)
    // }
    render() {
        return <div>
            <h3>异步组件</h3>
            <React.Suspense fallback={<div>Loading...</div>}>
                <ContextDemo/>
            </React.Suspense>
        </div>

        // 1. 强制刷新，可看到 loading (看不到就限制下 chrome 网速)
        // 2. 看 network 的 js 加载
    }
}

export default LazyDemo